<template>
  <view :class="viewClassNames">
    <view class="h-10 leading-10 text-center">视图标题：{{c.model.caption}}</view>
    <view class="h-10 leading-10 text-center">视图标识：{{c.model.id}}</view>
    <template v-for="ctrl in controls" :key="ctrl.name">
      <IBizList
        v-if="ctrl.name === 'mdctrl'"
        :context="c.context"
        :params="c.params"
        :modelData="ctrl"
      ></IBizList>
    </template>
  </view>
</template>

<script lang="ts" setup>
import { computed } from "vue";
import { getControlsByView, ViewController } from "@ibiz-template/runtime";
import { useNamespace, useViewController } from "../use";

const ns = useNamespace("view");
const c = useViewController((...args) => new ViewController(...args));

const controls = getControlsByView(c.model);

const { viewType, sysCss, codeName } = c.model;

const viewClassNames = computed(() => [
  ns.b(),
  ns.b(viewType.toLowerCase()),
  ns.m(codeName),
  sysCss?.cssName ? sysCss?.cssName : "",
  c.state.viewMessages.TOP ? "has-top-message" : "",
  c.state.viewMessages.BOTTOM ? "has-bottom-message" : ""
]);
</script>
